﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <base href="/netctoss/">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>NetCTOSS</title>
        <link type="text/css" rel="stylesheet" media="all" href="styles/global.css" />
        <link type="text/css" rel="stylesheet" media="all" href="styles/global_color.css" />
        <script language="javascript" type="text/javascript">
            //显示角色详细信息
            function showDetail(flag, a) {
                var detailDiv = a.parentNode.getElementsByTagName("div")[0];
                if (flag) {
                    detailDiv.style.display = "block";
                }
                else
                    detailDiv.style.display = "none";
            }
            //重置密码
            function resetPwd() {
                alert("请至少选择一条数据！");
                //document.getElementById("operate_result_info").style.display = "block";
            }
            //删除
            function deleteAdmin() {
                var r = window.confirm("确定要删除此管理员吗？");
                document.getElementById("operate_result_info").style.display = "block";
            }
            //全选
            function selectAdmins(inputObj) {
                var inputArray = document.getElementById("datalist").getElementsByTagName("input");
                for (var i = 1; i < inputArray.length; i++) {
                    if (inputArray[i].type == "checkbox") {
                        inputArray[i].checked = inputObj.checked;
                    }
                }
            }
        </script>
        <style type="text/css">
            li {
                list-style: none;
                float: left;
            }
        </style>
    </head>
    <body>
        <div id="navibar"></div>
        <!--主要区域开始-->
        <div id="main">
            <form action="" method="">
                <!--查询-->
                <div class="search_add">
                    <div>
                        模块：
                        <select id="selModules" class="select_search">
                            <option>全部</option>
                            <option>角色管理</option>
                            <option>管理员管理</option>
                            <option>资费管理</option>
                            <option>账务账号</option>
                            <option>业务账号</option>
                            <option>账单管理</option>
                            <option>报表</option>
                        </select>
                    </div>
                    <div>角色：<input type="text" value="" class="text_search width200" /></div>
                    <div><input type="button" value="搜索" class="btn_search"/></div>
                    <input type="button" value="密码重置" class="btn_add" onclick="resetPwd();" />
                    <input type="button" value="增加" class="btn_add" onclick="location.href='admin_add.html';" />
                </div>
                <!--删除和密码重置的操作提示-->
                <div id="operate_result_info" class="operate_fail">
                    <img src="images/close.png" onclick="this.parentNode.style.display='none';" />
                    <span>删除失败！数据并发错误。</span><!--密码重置失败！数据并发错误。-->
                </div> 
                <!--数据区域：用表格展示数据-->     
                <div id="data">            
                    <table id="datalist">
                        <tr>
                            <th class="th_select_all">
                                <input type="checkbox" onclick="selectAdmins(this);" />
                                <span>全选</span>
                            </th>
                            <th>管理员ID</th>
                            <th>姓名</th>
                            <th>登录名</th>
                            <th>电话</th>
                            <th>电子邮件</th>
                            <th>授权日期</th>
                            <th class="width100">拥有角色</th>
                            <th></th>
                        </tr>                      
                        <tr v-for="admin in pageInfo.list">
                            <td><input type="checkbox" /></td>
                            <td>{{admin.adminId}}</td>
                            <td>{{admin.adminName}}</td>
                            <td>{{admin.adminCode}}</td>
                            <td>{{admin.adminTelephone}}</td>
                            <td>{{admin.adminEmail}}</td>
                            <td>{{admin.adminEnrolldate}}</td>
                            <td>{{admin.roles}}</td>
                            <td class="td_modi">
                                <input type="button" value="修改" class="btn_modify" onclick="location.href='admin_modi.html';" />
                                <input type="button" value="删除" class="btn_delete" onclick="deleteAdmin();" />
                            </td>
                        </tr>

                    </table>
                </div>
                <!--分页-->
                <div id="pages">
                    <li><a @click="selectPage(1,pageInfo.pageSize)">首页</a></li>
                    <li><a @click="pageInfo.isFirstPage==true?selectPage(1,pageInfo.pageSize):selectPage(pageInfo.prePage,pageInfo.pageSize)">上一页</a></li>
                    <li v-for="i in pageInfo.navigatepageNums" :class="[pageInfo.pageNum==i?'current_page':'']"><a @click="selectPage(i,pageInfo.pageSize)">{{i}}</a></li>
                    <li><a @click="pageInfo.isLastPage==true?selectPage(pageInfo.pages,pageInfo.pageSize):selectPage(pageInfo.nextPage,pageInfo.pageSize)">下一页</a></li>
                    <li><a @click="selectPage(pageInfo.pages,pageInfo.pageSize)">末页</a></li>
                </div>
            </form>
        </div>
        <div>
            <script type="text/javascript" src="jquery/jquery.js"></script>
            <script type="text/javascript" src="vue/vue.js"></script>
            <script type="text/javascript" src="vue/axios.js"></script>
            <script type="text/javascript" src="js/admin/index.js"></script>
            <script type="text/javascript" src="layer/layer.js"></script>
        </div>
        <script>
            $(function(){//页面加载完成后加载
                //load（网页）  在组件加载的时候，发送ajax请求获取服务器返回回来的页面内容
                $("#navibar").load("html/common/navibar.html");
            })
        </script>
    </body>
</html>
